import React, { Fragment } from 'react'
import { View, StyleSheet, Text } from 'react-native'
import { ScaleT, ScaleS } from 'src/utils/ScreenUtil'
import PropTypes from 'prop-types'
import CustomButton from '../button/CustomButton'

export default function SelectModal (props) {
  const {
    onCancel, titleText, selectArr, selectClick
  } = props

  this.onItemClick = index => {
    selectClick && selectClick(index)
  }

  return (
    <Fragment>
      <View style={styles.photoSelectTopVIew}>
        <View style={styles.photoSelectItemView}>
          <Text style={styles.photoSelectAddText}>{titleText}</Text>
        </View>
        {selectArr.map((item, index) => (
          <View key={'selectArr' + index}>
            <View style={styles.photoLine}/>
            <CustomButton
              params={index}
              style={styles.photoSelectItemView}
              onPress={this.onItemClick}
            >
              <Text style={styles.photoSelectItemText}>{item.label}</Text>
            </CustomButton>
          </View>
        ))}
      </View>
      <CustomButton style={styles.cancelSelectView} onPress={onCancel}>
        <Text style={styles.cancelText}>取消</Text>
      </CustomButton>
    </Fragment>
  )
}

SelectModal.propTypes = {
  onCancel: PropTypes.func,
  selectClick: PropTypes.func,
  selectArr: PropTypes.array,
  titleText: PropTypes.string
}
SelectModal.defaultProps = {
  confirmText: '确定',
  cancelText: '取消',
  titleText: '温馨提示',
  contentText: '确定删除这条求职意向吗？'
}

const styles = StyleSheet.create({
  photoSelectTopVIew: {
    marginBottom: ScaleS(8),
    marginHorizontal: ScaleS(6),
    borderRadius: ScaleS(14),
    backgroundColor: '#F8F8F8',
    opacity: 0.82
  },
  photoSelectAddText: {
    color: '#8F8F8F',
    fontSize: ScaleT(13),
    fontWeight: '400'
  },
  photoLine: {
    height: ScaleS(1),
    backgroundColor: '#3F3F3F',
    opacity: 0.82
  },
  photoSelectItemView: {
    paddingVertical: ScaleS(15),
    justifyContent: 'center',
    alignItems: 'center'
  },
  photoSelectItemText: {
    color: '#007AFF',
    fontSize: ScaleT(20),
    fontWeight: '400'
  },
  cancelSelectView: {
    backgroundColor: 'white',
    borderRadius: ScaleS(14),
    paddingVertical: ScaleS(16),
    alignItems: 'center',
    justifyContent: 'center',
    marginBottom: ScaleS(6),
    marginHorizontal: ScaleS(6)
  },
  cancelText: {
    color: '#007AFF',
    fontSize: ScaleT(20),
    fontWeight: '400'
  }
})
